<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>订单详情</title>
<link rel="stylesheet" type="text/css" href="css/lib/swiper.min.css"/>
<link rel="stylesheet" type="text/css" href="css/lib/doumee.css"/>
<link rel="stylesheet" type="text/css" href="css/public.css"/>
<link rel="stylesheet" type="text/css" href="css/lib/dialog.css"/>
<link rel="stylesheet" type="text/css" href="css/active.css"/>
<link rel="stylesheet" type="text/css" href="css/shopCar.css"/>
<link rel="stylesheet" type="text/css" href="css/order.css"/>
<script src="js/lib/jquery-2.1.0.js" type="text/javascript" charset="utf-8"></script>
<script src="js/lib/swiper.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/lib/doumee.js" type="text/javascript" charset="utf-8"></script>
<script src="js/data.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>

<footer class="footer top-line flex-row main-line" id="bottomButton">
	<a href="mall.html" class="flex-full">返回商城</a>
	<a onclick="showCode()" class="flex-full btn-1">核销二维码</a>
</footer>

<div class="swiper-container Main" id="Main">
	<div class="swiper-wrapper">
		<div class="swiper-slide content">
			
			<div class="children" id="shopCar">
				
				<!--配送方式-->
				<div class="sendMod bg-w dm-mt dm-mb">
					<!--选择地址-->
					<ul class="selAddr h5">
						<li class="name">曹伟 18756197235</li>
						<li class="address">安徽省合肥市蜀山区西湖国际广场C座</li>
					</ul>
				</div>
				
				<!--商品信息-->
				<div class="dm-norlist bottom-line bg-w dm-mt">
					<ul class="list flex-row">
						<li class="name">快递到家</li>
						<li class="cot tr flex-full section">已付款</li>
					</ul>
				</div>
				<div class="shopMod bg-w">
					<ul class="shopBox bottom-line flex-row">
						<li class="photo cover">
							<img src="image/test/pro-1.png" />
						</li>
						<li class="info flex-full">
							<ol class="name-box flex-row">
								<li class="name-l flex-full">
									<h5 class="name">这里是商品名称这里是商品名称这里是商品名称</h5>
									<h6 class="spec">红色;12寸;微辣</h6>
								</li>
							</ol>
							<ol class="val-box dm-clearfix">
								<li class="val dm-left">￥<span class="singleVal">1200.00</span></li>
								<li class="box flex-row dm-right h6">×2</li>
							</ol>
						</li>
					</ul>
				</div>
				
				<!--订单信息-->
				<div class="dm-norlist bg-w dm-mt dm-mb">
					<ul class="list bottom-line flex-row">
						<li class="name">订单编号</li>
						<li class="cot tr flex-full">20185646448112</li>
					</ul>
					<ul class="list bottom-line flex-row">
						<li class="name">下单时间</li>
						<li class="cot tr flex-full">2018-09-20 10:45</li>
					</ul>
				</div>
				
				<!--价格信息-->
				<div class="dm-norlist bg-w dm-mt dm-mb">
					<ul class="list bottom-line flex-row">
						<li class="name">支付方式</li>
						<li class="cot tr flex-full">微信支付</li>
					</ul>
					<ul class="list bottom-line flex-row">
						<li class="name">商品总价</li>
						<li class="cot tr flex-full">￥1200.00</li>
					</ul>
					<ul class="list bottom-line flex-row">
						<li class="name">优惠券</li>
						<li class="cot tr flex-full red">￥10.00</li>
					</ul>
					<ul class="list bottom-line flex-row">
						<li class="name">积分抵扣</li>
						<li class="cot flex-full">
							<label class="flex-row flex-right">扣除60积分<span class="red">(￥30.00)</span></label>
						</li>
					</ul>
					<ul class="list bottom-line flex-row">
						<li class="name">会员折扣</li>
						<li class="cot tr flex-full">95折</li>
					</ul>
					<ul class="list flex-row">
						<li class="name">运费</li>
						<li class="cot tr flex-full">￥10.00</li>
					</ul>
					<ul class="list top-line flex-row">
						<li class="name red">应付合计</li>
						<li class="cot tr red flex-full">￥12000.00</li>
					</ul>
				</div>
				
				<!--物流信息-->
				<div class="dm-norlist bg-w dm-mt dm-mb">
					<ul class="list bottom-line flex-row">
						<li class="name">运单号</li>
						<li class="cot tr flex-full">20185646448112</li>
					</ul>
					<ul class="list bottom-line flex-row">
						<li class="name">物流公司</li>
						<li class="cot tr flex-full">顺丰快递</li>
					</ul>
				</div>
				
			</div>
			
		</div>
	</div>
</div>

<script type="text/javascript">
//复制商品数据
new copy('.shopMod',2).data();
pullSwiper('#Main');


//显示核销二维码
function showCode(){
	$('body').append(`
		<div id="codeMask">
			<div class="mask"></div>
			<div class="code-box flex-col">
				<h4 class="bt">核销二维码</h4>
				<img src="image/test/code.jpg" />
			</div>
		</div>
	`);
	$("#codeMask").click(function(){
		$("#codeMask").fadeOut(function(){
			$("#codeMask").remove();
		});
	});
};

</script>

</body>
</html>
